<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>19_event对象和target对象的兼容性问题</title>
    </head>
    <body>
        <ul>
            <li>陈飞宇</li>
            <li>吴亦凡</li>
            <li>柯震东</li>
            <li>房祖名</li>
            <li>李易峰</li>
            <li>宋冬野</li>
        </ul>


        <script>
            //  (1)无法获取未定义或 null 引用的属性“target”
            //  event对象 无法使用
            // event = event || window.event;

            // （2） 无法获取未定义或 null 引用的属性“nodeName”
            // target对象 无法使用
            // var target = event.target || event.srcElement;

            
            var ul = document.querySelector('ul');

            ul.onmouseover = function(event){
                event = event || window.event;
                var target = event.target || event.srcElement;
                if(target.nodeName == 'LI'){
                    target.style.backgroundColor = 'yellowgreen';
                }
            }

            ul.onmouseout = function(event){
                event = event || window.event;
                var target = event.target || event.srcElement;
                if(target.nodeName == 'LI'){
                    target.style.backgroundColor = '';
                }
            }
        </script>
    </body>
</html>